<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>心念长安</title>
    <link rel="stylesheet" href="style/index.css">
    <script src="JavaScript/jquery-3.3.1.min.js"></script>
    <script src="JavaScript/leaves.js"></script>
</head>

<body>
<div id="container">
    <img src="image/index-images/bg2.jpg" alt="bg" class="bg-img">
    <img src="image/index-images/bg3.jpg" alt="bg" class="bg-img">
    <img src="image/index-images/bg1.jpg" alt="bg" class="bg-img">
    <img src="image/index-images/bg4.jpg" alt="bg" class="bg-img">
    <div id="left"></div>
    <div id="title">
        <span>魅力长安</span>
        <span>心之所往</span>
    </div>
    <div id="center"></div>
    <div id="more"></div>
    <div id="more-pos">
        <div id="more-content">
            <div class="little-circle">
                <img src="image/index-images/3.jpg" alt="历史" class="nav-img">
                <div class="cover">历史</div>
            </div>

            <div class="little-circle">
                <img src="image/index-images/2.jpg" alt="风景" class="nav-img">
                <div class="cover">风景</div>
            </div>
            <div class="little-circle">
                <img src="image/index-images/1.jpg" alt="美食" class="nav-img">
                <div class="cover">美食</div>
            </div>
            <div class="little-circle">
                <img src="image/index-images/4.jpg" alt="故事" class="nav-img">
                <div class="cover">故事</div>
            </div>
            <div class="little-circle" style="border-radius: 0;">
                <img src="image/index-images/0.jpg" alt="bg" class="nav-img" style="border-radius: 0">
            </div>
        </div>
    </div>

</div>
<script src="JavaScript/index.js"></script>
</body>
</html>